﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>iGoal</title>
<!--script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script-->
<script type="text/javascript" src="scripts/fancybox/jquery.mousewheel-3.0.2.pack.js"></script>
<script type="text/javascript" src="scripts/fancybox/jquery.fancybox-1.3.1.js"></script>
<script type="text/javascript" src="scripts/jquery.jeditable.js"></script>
<script type="text/javascript" src="scripts/DD_roundies_0.0.2a-min.js"></script> 


<script type="text/javascript" src="scripts/jquery-1.4.2.min.js"></script>     

<script type="text/javascript" src="scripts/jquery.custom.select.js"></script>

<link rel="stylesheet" type="text/css" href="script/fancybox/jquery.fancybox-1.3.1.css" media="screen" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="styles/tmpStyle.css" rel="stylesheet" type="text/css" />
<link href="styles/pigStyle.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
jQuery(function() {
	jQuery("select.stageNumber").styledSelect( {
		cls : "select horizontalElect selectStageList dropshadowBox"
	}, ".numberOfStage");
});
</script>
</head>
<body>
<div id="all">
  <div id="header">
    <div class="top">
      <input type="text" class="input_search" />
      <input type="button" class="button_search" />
    </div>
    <div class="banner">
      <div id="logo"><img src="images/logo/logo.png" alt="igoal.vn" /></div>
      <div class="w1">
        <div></div>
      </div>
      <div id="slogan">chia sẻ mục tiêu của bạn</div>
    </div>
  </div>
  <div id="acc_contain"> <a class="avatar"><img src="images/avatar.png" alt="" /></a>
    <div class="infomation">
      <div class="title"><b style="float:left">“</b> <div class="editable edittext" style="display:inline">hôm nay buồn buồn sao ý mấy bạn ạ... </div><b>”</b></div>
      <div class="updatetime">Cập nhật cách đây 1 giờ 20 phút</div>
      <div class="icon"> <a class="smiles"></a>
        <div class="w2"></div>
        <a class="contact"></a>
        <div class="w2"></div>
        <a class="friend"></a>
        <div class="w2"></div>
        <a class="support"></a> </div>
    </div>
  </div>
  <div class="w3"></div>
  <style>
  	
  </style>
  <div id="infomation">
    <div id="left">
 		<div class="dashboardTab">
        	<ul>
            	<li>
                	<a href="#" title="Chia sẻ mục tiêu của bạn!" class="d2Goal">MỤC TIÊU</a>
                </li>
                <li>
                	<a href="#" title="Kết nối bạn bè!" class="d2Wall ">TƯỜNG NHÀ</a>
                </li>
                <li>
                	<a href="#" title="Những bài viết hay!" class="d2News selected">CHIA SẺ</a>
                </li>
            </ul>
        </div>
        <div class="clearthis"></div>

        <div class="dashboardBlueBox blueBoxNews">
			<a class="newsSpotImage" href="#"><img src="images/test.png" width="170"/></a>
            <div class="wallNewsArticle spotOnWall">
            	<h1><a href="#">iGoal tung phiên bản con Lợn</a></h1>
                <p>Cuối tuần này, Tottenham và MU sẽ giáp mặt nhau ở Premier League. Dù ở bất kỳ thời điểm nào, đó đều là những cuộc chiến khá hấp dẫn, gay cấn và vô số bàn thắng được ghi.</p>
            </div>
        </div>
        <div class="clearthis"></div>
        <div class="contentHeader">
        	<span class="icon_1 iconYSD"></span><h1>THÔNG TIN VỀ MỤC TIÊU CỦA BẠN</h1>
            <span class="fr previousLink"><a href="#">&laquo; Quay lại</a></span>
         </div>   
         <style>
		 	
		 </style>
        <div class="smartGoalContainer">
        	
            <ul>
            	<li>
                	<label class="inputLabelGrey">Kết quả cụ thể (đo lường được) mà bạn mong muốn là gì?</label>
                    <input type="text" class="inputStyle" style="width:430px"/>
                    <div class="clearthis"></div>
                    <p class="exampleText"><b>Ví dụ:</b> bạn có mục tiêu "giảm cân" bạn nên xác định cụ thể là giảm 10kg hay 5kg.</p>
                </li>
                <li>
                	<label class="inputLabelGrey">Thời gian hoàn thành:</label>
                    <input type="text" class="inputStyle" style="width:170px"/><a href="" class="datePicker"></a>
                </li>
            </ul>
            <div class="clearthis"></div>
            <div class="contentHeader" style="margin:20px 0px">
        		<span class="icon_1 iconYSD"></span><h1>KẾ HOẠCH THỰC HIỆN</h1>
       		</div> 
            <div class="messageBox infoMessage">
            	<!--  Change class successMessage to failMessage or infoMessage--->
                <span class="icon_1"></span>
                <div class="messageText">
                    <h1 style="font-size:14px">Lời khuyên từ iGoal.</h1>
                    <p style="font-size:11px;padding-left:0px">Bạn nên chia quá trình thực hiện mục tiêu của bạn thành nhiều giai đoạn và các công việc nhỏ ra để dễ kiểm soát mục tiêu cũng như thời gian đạt được nó, công cụ phía dưới đây giúp bạn thực hiện điều này.</p>
                </div>
            </div> 
            
            <ul class="smartGoaUl">
	          	<li class="selectStage">
                	<label class="inputLabelGrey">Bạn muốn chia quá trình hoàn thành mục tiêu này thành mấy giai đoạn?</label>
                    <div class="clearthis"></div>
                    <ol class="numberOfStage">
                        <select class="stageNumber">
                            <option value="1">1 giai đoạn</option>
                            <option value="2">2 giai đoạn</option>
                            <option value="3">3 giai đoạn</option>
                            <option value="4">4 giai đoạn</option>
                            <option value="5">5 giai đoạn</option>
                            <option value="6">6 giai đoạn</option>
                            <option value="7">7 giai đoạn</option>
                            <option value="8">8 giai đoạn</option>
                            <option value="9">9 giai đoạn</option>
                           
                         </select>
                     </ol>
                                              
                </li>
                <li>
                	<label class="inputLabelGrey">Điền thông tin công việc phải làm cho các giai đoạn:</label>
                    <p style="margin-bottom:10px">Hãy điền thông tin công việc tương ứng cho từng giai đoạn và số % mà công việc đó chiếm trong tổng 100% của mục tiêu</p>
                    <ol class="listTaskGoal">
                    	<label class="fl">01</label>
                        <input type="text"  class="inputStyle taskName" />
                        <input type="text"  class="inputStyle taskPercent" />
                        <input type="text"  class="inputStyle taskDeadline" />
                        <a href="" class="datePicker fl"></a>
                    </ol>
                    <ol class="listTaskGoal">
                    	<label class="fl">02</label>
                        <input type="text"  class="inputStyle taskName" />
                        <input type="text"  class="inputStyle taskPercent" />
                        <input type="text"  class="inputStyle taskDeadline" />
                        <a href="" class="datePicker fl"></a>
                    </ol>
                </li>
                
                <li>
                	<a href="#" class="btnSubmitTask">Tạo mục tiêu</a>
                </li>
    

            </ul>
            
        </div>
        
        
    
    
    </div> <!--end Left-->
    <div id="right">
    	<div class="w6"></div>
    	<div id="goalrank">
        	<div class="title">Thông tin về mục tiêu này</div>
            <div class="rank">Tổng số người thực hiện: <b>1400</b> người<br />
            Tổng số người hoàn thành: <b>375</b> người<br />
            Thời gian trung bình hoàn thành: <b>32</b> ngày<br />
            Tổng số giải pháp đưa ra: <b>500</b> người<br />
            </div>
        </div>
      <div class="question">
        <h1>Cập nhật thông tin cá nhân</h1>
      </div>
      <div id="updateuser" class="bogoc">
        <div class="score2">
        	<div class="scorebar">
            	<div class="left"></div>
                <div class="center" style="width:70px">25% |</div>
                <div class="right"></div>
            </div>
        </div>
        <div class="w6"></div>
        <div class="sharingtip">
          <div class="icontip"></div>
          <div class="tip"><a>Cập nhật các thông tin cơ bản +<b>15</b>%</a></div></div>
        <div class="sharingtip">
          <div class="icontip"></div>
           <div class="tip"><a>Thêm hình đại diện +<b>15</b>%</a></div></div>
        <div class="sharingtip">
          <div class="icontip"></div>
           <div class="tip"><a>Thêm thông tin về sở thích +<b>15</b>%</a></div></div>
        <div class="sharingtip">
          <div class="icontip"></div>
           <div class="tip"><a>Chia sẻ mục tiêu của bạn +<b>15</b>%</a></div></div>
        <div class="w6"></div>
        <div id="hot"> <b>Tại sao bạn phải cập nhật thông tin cá nhân ?</b><br />
          <br />
          iGoal sẽ dựa trên thông tin cơ bản của bạn để gợi ý danh sách những bạn bè của bạn hiện đang hoạt động trên iGoal </div>
      </div>
      <div class="question">
        <h1>Giới thiệu bản thân</h1>
      </div>
      <div id="aboutme">
        <div class="top"></div>
        <div class="middle">
        <div class="icon"></div>
        <div class="editabletext">Tôi 20 tuổi, nhiều hoài bão, ước mơ! Tôi luôn đặt mục tiêu cho bản thân mình để hướng đến và hoàn thiện mình hơn...</div>
        </div>
        <div class="buttom"> </div>
        <div class="question">
          <h1>Danh sách bạn bè <b style="color:#CA4A0C">(18)</b></h1>
          <div class="dem1"><a class="viewall"></a></div>
        </div>
        
        <div class="clearthis"></div>
        <div class="friendListBox">
        	<ul>
            	<li>
                	<span class="online"></span><a href="#"><img src="images/avatars/3.png" width="50"/></a>
                    <div class="tooltipAvatar">
                    	<a href="#" class="fl avatar"><img src="images/avatars/3.png" width="74"/></a>
                        <span>
                        	<h2><a href="#">Phan Ngọc Sang</a></h2>
                            <p><a href="#">Trang cá nhân</a> | <label class="online">ONLINE</label></p>
                            <ul>
                            	<li><a href="#">&bull; Đang thực hiện: <b>5 mục tiêu</b></a></li>
                                <li><a href="#">&bull; Đã hoàn thành: <b>5 mục tiêu</b></a></li>
                                <li><a href="#">&bull; Số bài chia sẻ: <b>5 bài viết</b></a></li>
                            </ul>
                        </span>
                    </div>
                </li>
                <li>
                	<span class="offline"></span><a href="#"><img src="images/avatars/3.png" width="50"/></a>
                    <div class="tooltipAvatar" style="display:none;">
                    	<a href="#" class="fl avatar"><img src="images/avatars/3.png" width="74"/></a>
                        <span>
                        	<h2><a href="#">Phan Ngọc Sang</a></h2>
                            <p><a href="#">Trang cá nhân</a> | <label class="online">ONLINE</label></p>
                            <ul>
                            	<li><a href="#">&bull; Đang thực hiện: <b>5 mục tiêu</b></a></li>
                                <li><a href="#">&bull; Đã hoàn thành: <b>5 mục tiêu</b></a></li>
                                <li><a href="#">&bull; Số bài chia sẻ: <b>5 bài viết</b></a></li>
                            </ul>
                        </span>
                    </div>
                </li>
             
                
            </ul>
        </div>
        <div class="w6"></div>
        <div class="question">
          <h1>Có thể bạn biết</h1>
          <div class="dem2"><a class="nextframe"></a><a class="prevframe"></a></div>
        </div>
        <div class="hintFriend">
          <a class="avatar" href="#"><img src="images/avatar/_r7_c1.png" alt=""></a>
          <div class="infofriend"> <span class="friendname"><a>Putil olami</a></span>
            <label class="mutualFriend">Có chung 5 bạn bè</label>
            <b class="off">OFFLINE</b>
          </div>
          <a href="#" class="followFriend">KẾT BẠN</a>
          <a href="#" class="commentDelete deleteMutualFriend"></a>
        </div>
      </div>
    </div>
  </div>
</div>
<br />
<br />
<br />
<br />
<br />

</body>
</html>
